const canUseDOM = !!(
  typeof window !== "undefined" &&
  window.document &&
  window.document.createElement
);

let isEnabled = false;

const HOVER_THRESHOLD_MS = 1000;
let lastTouchTimestamp = 0;

function enableHover() {
  if (isEnabled || Date.now() - lastTouchTimestamp < HOVER_THRESHOLD_MS) {
    return;
  }
  isEnabled = true;
}

function disableHover() {
  lastTouchTimestamp = Date.now();
  if (isEnabled) {
    isEnabled = false;
  }
}

if (canUseDOM) {
  document.addEventListener("touchstart", disableHover, true);
  document.addEventListener("touchmove", disableHover, true);
  document.addEventListener("mousemove", enableHover, true);
}

export function isHoverEnabled() {
  return isEnabled;
}


/*
addEventListener（，，）的第三个参数是默认形式(false)是按照事件冒泡触发；
false=事件冒泡: 事件从目标元素父元素向上逐级传递直到最顶层元素(就是从里往外)。true=事件捕获: 事件从最顶层元素一直传递到目标元素(就是从外往内)；
如果子元素和父元素同时使用addEventListener触发事件,同时设置第三个参数是true,说明事件是按照捕获的形式触发,从外到内先触发外层的div绑定的事件,再触发内层的p绑定的事件。
给addEventListener传递了第三个参数为true,那么解除绑定的时候也需要给removeEventListener传递第三个参数为true。
绑定事件的时候addEventListener不推荐使用箭头函数或者匿名函数。
onClick绑定的事件是在冒泡阶段执行的，如何监听捕获阶段的事件呢？onClickCapture，只需要在事件绑定加上xxxCapture后缀，React会在捕获阶段调用事件回调执行。
.stopPropagation()阻止事件冒泡 || 阻止事件传播=xxxCapture方式的也能阻断掉的。
  onTouchStartCapture       onTouchStart
  onTouchMoveCapture        onTouchMove
  onTouchEndCapture         onTouchEnd
这两组的后缀有Capture的事件是捕获事件(事件由外向内被触发),没有后缀的是冒泡事件(事件由内向外被触发);?两个事件都有机会产生吗和addEventListener(第三个参数)什么关联;两种是类似替换关系。
addEventListener是手动设置钩子执行函数的。onTouchStartxxx这样的是直接绑定到Div上面的。看着是同一个目的的两种做法，addEventListener更加灵活。
手机场景下：判断是点击目的的还是拖拽滑动的？  https://www.bbsmax.com/A/6pdDZADkJw/
* */
